<template>
  <div class="new-channel">
    <Breadcrumb>
      <BreadcrumbItem v-for="(name, i) in breadcrumb"
                      :key="i">{{ name }}</BreadcrumbItem>
    </Breadcrumb>
    <div class="form">
      <Form ref="formItem"
            :model="formItem"
            :rules="formRule"
            :label-width="140"
            label-position="left">
        <Row class="base-form">
          <p>基本信息</p>
          <FormItem prop="companyUuid"
                    label="uuid：">
            <Input type="text"
                   v-model="formItem.companyUuid"
                   placeholder="无需填写，系统自动生成"
                   readonly
                   style="width: 300px;" />
          </FormItem>
          <FormItem prop="companyName"
                    label="商户名称：">
            <Input type="text"
                   v-model="formItem.companyName"
                   placeholder="商户名称"
                   style="width: 300px;" />
          </FormItem>
          <FormItem prop="companyAbbreviation"
                    label="商户简称：">
            <Input type="text"
                   v-model="formItem.companyAbbreviation"
                   placeholder="商户简称(不得超过8个字符)"
                   :maxlength="8"
                   style="width: 300px;" />
          </FormItem>
          <FormItem label="商户状态："
                    prop="status">
            <Select v-model="formItem.status"
                    placeholder="商户状态"
                    style="width: 300px;"
                    filterable
                    clearable>
              <Option v-for="item in MerchantStatus"
                      :value="item.value"
                      :key="item.value">{{ item.label }}</Option>
            </Select>
          </FormItem>
          <FormItem label="商户类型："
                    prop="companyType">
            <Select v-model="formItem.companyType"
                    placeholder="商户类型"
                    style="width: 300px;"
                    filterable
                    clearable>
              <Option v-for="item in MerchantType"
                      :value="item.value"
                      :key="item.value">{{ item.label }}</Option>
            </Select>
          </FormItem>
          <FormItem label="省份城市："
                    prop="depc">
            <Cascader :data="pcList"
                      v-model="formItem.depc"
                      @on-change="selectPc"
                      :load-data="loadData"
                      style="width: 300px;"></Cascader>
          </FormItem>
          <FormItem prop="address"
                    label="详细地址：">
            <Input type="text"
                   v-model="formItem.address"
                   placeholder="详细地址"
                   clearable
                   style="width: 300px;" />
          </FormItem>
          <!-- <FormItem prop="domain" label="域名：">
            <Input type="text" v-model="formItem.domain" placeholder="域名" clearable style="width: 300px;"/>
          </FormItem> -->
          <!-- <FormItem prop="accountName" label="管理员姓名：">
            <Input type="text" v-model="formItem.accountName" placeholder="管理员姓名" clearable style="width: 300px;"/>
          </FormItem>
          <FormItem prop="telephone" label="管理员账号：">
            <Input type="text" v-model="formItem.telephone" placeholder="管理员账号" clearable style="width: 300px;"/>
          </FormItem> -->
          <FormItem prop="introduction"
                    label="公司简介：">
            <Input type="textarea"
                   :autosize="{minRows: 3}"
                   v-model="formItem.introduction"
                   placeholder="公司简介"
                   clearable
                   style="width: 300px;" />
          </FormItem>
          <!-- <FormItem prop="agencyServiceName" label="分销公众号名称：">
            <Input type="text" v-model="formItem.agencyServiceName" placeholder="分销公众号名称" clearable style="width: 300px;"/>
          </FormItem> -->
          <Form :ref="'formItem' + index"
                v-for="(item, index) in formItem.wxConfigs"
                :key="index"
                :model="item"
                :rules="formRule"
                :label-width="140"
                label-position="left"
                style="display: block;">

            <p>
              微信端信息{{ index + 1}}&nbsp;&nbsp;
              <Button type="success"
                      size="small"
                      v-if="index === 0"
                      @click="addWx">+添加微信配置</Button>
              <Button type="error"
                      size="small"
                      v-else
                      @click="deleteWx(index)">删除</Button>
            </p>
            <FormItem label="所属系统："
                      prop="systemId">
              <Select v-model="item.systemId"
                      placeholder="所属系统"
                      style="width: 300px;"
                      filterable
                      clearable>
                <Option v-for="items in systemIdList"
                        :value="items.value"
                        :key="items.value">{{ items.label }}</Option>
              </Select>
            </FormItem>
            <FormItem label=""
                      prop="agencyWeappFrom"
                      v-if="item.systemId==='7'">
              <label>
                <input type="radio"
                       value="0"
                       v-model="item.agencyWeappFrom">闪卖小程序&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
              </label>
              <label>
                <input type="radio"
                       value="1"
                       v-model="item.agencyWeappFrom">客户自有小程序
              </label>
            </FormItem>
            <FormItem label=""
                      prop="agencyServiceFrom"
                      v-if="item.systemId==='8'">
              <label>
                <input type="radio"
                       value="0"
                       v-model="item.agencyServiceFrom">闪卖公众号&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
              </label>
              <label>
                <input type="radio"
                       value="1"
                       v-model="item.agencyServiceFrom">客户自有公众号
              </label>
            </FormItem>
            <FormItem prop="appName"
                      label="小程序名称："
                      v-if="item.systemId==7 && item.agencyWeappFrom==1">
              <Input type="text"
                     v-model="item.appName"
                     placeholder="小程序名称："
                     clearable
                     style="width: 300px;" />
            </FormItem>
            <FormItem prop="appName"
                      label="公众号名称："
                      v-if="item.systemId==8 && item.agencyServiceFrom==1">
              <Input type="text"
                     v-model="item.appName"
                     placeholder="公众号名称："
                     clearable
                     style="width: 300px;" />
            </FormItem>
            <div v-if="!((item.systemId==7 && item.agencyWeappFrom==0) || (item.systemId==8 && item.agencyServiceFrom==0) )">
              <FormItem prop="appId"
                        label="微信appId：">
                <Input type="text"
                       v-model="item.appId"
                       placeholder="微信appId"
                       clearable
                       style="width: 300px;" />
              </FormItem>
              <FormItem prop="appSecret"
                        label="微信appSecret：">
                <Input type="text"
                       v-model="item.appSecret"
                       placeholder="微信appSecret"
                       clearable
                       style="width: 300px;" />
              </FormItem>
              <!-- <FormItem prop="saveJs" label="安全域名JS：">
                <Input type="text" readonly v-model="item.saveJs" placeholder="安全域名JS" clearable style="width: 300px;">
                  <Upload action="//jsonplaceholder.typicode.com/posts/" slot="append" class="js-com">
                    <Button type="primary" class="upload-js">上传</Button>
                  </Upload>
                </Input>
              </FormItem>
              <FormItem prop="webPageJs" label="网页授权JS：">
                <Input type="text" readonly v-model="item.webPageJs" placeholder="网页授权JS" clearable style="width: 300px;">
                  <Upload action="//jsonplaceholder.typicode.com/posts/" slot="append" class="js-com">
                    <Button type="primary" class="upload-js">上传</Button>
                  </Upload>
                </Input>
              </FormItem> -->
              <FormItem label="开通微信推送："
                        prop="weChatPush">
                <Select v-model="item.weChatPush"
                        placeholder="开通微信推送"
                        style="width: 300px;"
                        filterable
                        clearable>
                  <Option v-for="item in sfList"
                          :value="item.value"
                          :key="item.value">{{ item.label }}</Option>
                </Select>
              </FormItem>
              <div v-if="item.weChatPush === '1'">
                <FormItem prop="reportTemplateId"
                          label="报备模板ID：">
                  <Input type="text"
                         v-model="item.reportTemplateId"
                         placeholder="报备模板ID"
                         clearable
                         style="width: 300px;" />
                </FormItem>
                <FormItem prop="statusChangeId"
                          label="状态变更ID：">
                  <Input type="text"
                         v-model="item.statusChangeId"
                         placeholder="状态变更ID"
                         clearable
                         style="width: 300px;" />
                </FormItem>
                <FormItem prop="reviewRejectionId"
                          label="审核驳回ID：">
                  <Input type="text"
                         v-model="item.reviewRejectionId"
                         placeholder="审核驳回ID"
                         clearable
                         style="width: 300px;" />
                </FormItem>
                <FormItem prop="projectApprovalId"
                          label="项目审批ID：">
                  <Input type="text"
                         v-model="item.projectApprovalId"
                         placeholder="项目审批ID"
                         clearable
                         style="width: 300px;" />
                </FormItem>
              </div>
            </div>
          </Form>

          <p>系统打通信息</p>
          <FormItem label="M2打通："
                    prop="merchant2">
            <Select v-model="formItem.merchant2"
                    @on-change="M2Change"
                    placeholder="M2打通"
                    style="width: 300px;"
                    filterable
                    clearable>
              <Option v-for="item in sfList"
                      :value="item.value"
                      :key="item.value">{{ item.label }}</Option>
            </Select>
          </FormItem>
          <FormItem label="M2商户号："
                    prop="merchantCode"
                    v-if="showMerchantCode === '1'">
            <Input type="text"
                   v-model="formItem.merchantCode"
                   placeholder="M2商户号"
                   clearable
                   style="width: 300px;" />
          </FormItem>
          <FormItem label="M2参与客户判重："
                    prop="checkM2Repeat">
            <Select v-model="formItem.checkM2Repeat"
                    placeholder="M2参与客户判重"
                    style="width: 300px;"
                    filterable
                    clearable>
              <Option v-for="item in sfList"
                      :value="item.value"
                      :key="item.value">{{ item.label }}</Option>
            </Select>
          </FormItem>
          <FormItem label="一二手联动："
                    prop="outsideSwitch">
            <Select v-model="formItem.outsideSwitch"
                    placeholder="一二手联动"
                    style="width: 300px;"
                    filterable
                    clearable>
              <Option v-for="item in statusList"
                      :value="item.value"
                      :key="item.value">{{ item.label }}</Option>
            </Select>
          </FormItem>
          <FormItem label="短信验真："
                    prop="checkSwitch">
            <Select v-model="formItem.checkSwitch"
                    placeholder="验真开关"
                    style="width: 100px;"
                    filterable
                    clearable>
              <Option v-for="item in statusList"
                      :value="item.value"
                      :key="item.value">{{ item.label }}</Option>
            </Select>
            <Input type="text"
                   v-model="formItem.checkTemp"
                   placeholder="验真模板："
                   clearable
                   style="width: 200px;" />
          </FormItem>
        </Row>
        <Row class="base-table">
          <p>功能授权</p>
          <table cellspacing="0"
                 cellpadding="0"
                 class="function-table">
            <thead>
              <tr>
                <td>功能项</td>
                <td>授权时长</td>
                <td>是否开启</td>
              </tr>
            </thead>
            <tbody>
              <tr>
                <td>是否使用佣金</td>
                <td>-</td>
                <td>
                  <Checkbox v-model="formItem.commission"></Checkbox>
                </td>
              </tr>
              <tr>
                <td>是否短信提醒</td>
                <td>-</td>
                <td>
                  <Checkbox v-model="formItem.message"></Checkbox>
                </td>
              </tr>
              <!-- <tr>
                <td>是否开启小程序消息推送</td>
                <td>-</td>
                <td>
                  <Checkbox v-model="formItem.weappMessage"></Checkbox>
                </td>
              </tr> -->
            </tbody>
          </table>

          <p>LOGO设置</p>
          <table cellspacing="0"
                 cellpadding="0"
                 class="logo-table">
            <thead>
              <tr>
                <td>LOGO位置</td>
                <td>当前LOGO</td>
                <td>操作</td>
              </tr>
            </thead>
            <tbody>
              <tr v-for="(item, index) in uploadList"
                  :key="index">
                <td>
                  <div class="label">{{ item.label }}</div>
                  <span class="remark">{{ item.remark }}</span>
                </td>
                <td style="padding: 5px 10px;">
                  <img src="@/assets/images/default-img.png"
                       v-if="!item.photoList.length"
                       style="width: 100px; height: 80px;">
                  <viewer :images="item.photoList"
                          class="demo-upload-list-priview">
                    <img v-for="(item1, index1) in item.photoList"
                         :key="index1"
                         :src="item1">
                  </viewer>
                </td>
                <td class="upload">
                  <Upload ref="upload"
                          :show-upload-list="false"
                          :default-file-list="defaultList"
                          :on-success="handleSuccess"
                          :format="['jpg','jpeg','png']"
                          :max-size="1024"
                          :on-format-error="handleFormatError"
                          :on-exceeded-size="handleMaxSize"
                          multiple
                          type="drag"
                          :headers="headers"
                          action="/bomc/common/uploadFile"
                          style="display: inline-block;">
                    <a @click="selectCell(index, item.fieldName)">上传图片</a>
                  </Upload>
                  &nbsp;&nbsp;
                  <a class="hf"
                     v-if="item.photoList.length"
                     @click="backDefault(index, item.fileName)">恢复默认</a>
                </td>
              </tr>
            </tbody>
          </table>
        </Row>
      </Form>
      <div class="on-submit">
        <Button type="success"
                size="large"
                @click="onSubmit('formItem')">保存商户信息</Button>
      </div>
    </div>
  </div>
</template>

<script>
import Api from '@/api';

const companyApi = Api.Company;
const commonApi = Api.Common;

export default {
  name: 'newchannel',
  data() {
    return {
      headers: { 'qf-channel-bomc-token': sessionStorage.getItem('token') },
      breadcrumb: ['渠道商管理', '新增渠道商'],
      id: '',
      formItem: {
        companyType: '',
        companyName: '',
        companyAbbreviation: '',
        status: '',
        province: '',
        city: '',
        zone: '',
        address: '',
        domain: 'qudaowang',
        accountName: '',
        telephone: '',
        introduction: '',
        // agencyServiceName: '',
        wxConfigs: [
          {
            systemId: '0', // 系统类型：0 全部 2 案场 3 分销
            appName: '',
            appId: '',
            appSecret: '',
            projectApprovalId: '',
            reportTemplateId: '',
            reviewRejectionId: '',
            statusChangeId: '',
            weChatPush: '',
            showAgencyWeappFrom: false,
            showAgencyServiceFrom: false,
            agencyServiceFrom: 0,
            agencyWeappFrom: 0,
          },
        ],
        merchant2: '',
        merchantCode: '',
        checkM2Repeat: '',
        outsideSwitch: '',
        checkSwitch: '0',
        checkTemp: '',
        commission: false,
        weappMessage: false,
        message: false,
        developersLoginLogo: '',
        developersIndexLogo: '',
        assistantLoginLogo: '',
        assistantIndexLogo: '',
        assistantExitLogo: '',
        agencyLoginLogo: '',
        agencyIndexLogo: '',
        agencyServiceLogo: '',
        agencyWeappLogo: '',
        h5LoginLogo: '',
        depc: [],
      },
      pcList: [],
      systemIdList: [
        {
          label: '案场和分销',
          value: '0',
        },
        {
          label: '案场',
          value: '2',
        },
        {
          label: '分销',
          value: '3',
        },
        {
          label: '分销小程序',
          value: '7',
        },
        {
          label: '分销小程序对应公众号',
          value: '8',
        },
      ],
      statusList: [
        {
          label: '不开通',
          value: '0',
        },
        {
          label: '开通',
          value: '1',
        },
      ],
      sfList: [
        {
          label: '是',
          value: '1',
        },
        {
          label: '否',
          value: '0',
        },
      ],
      MerchantStatus: [
        {
          label: '启用',
          value: '2',
        },
        {
          label: '禁用',
          value: '3',
        },
      ],
      MerchantType: [
        {
          label: '开发商',
          value: 20,
        },
        {
          label: '总代公司',
          value: 30,
        },
        {
          label: '试用商户',
          value: 40,
        },
      ],
      formRule: {
        companyType: [
          {
            required: true,
            type: 'number',
            message: '此项必填',
            trigger: 'blur',
          },
        ],
        companyName: [{ required: true, message: '此项必填', trigger: 'blur' }],
        companyAbbreviation: [
          { required: true, message: '此项必填', trigger: 'blur' },
        ],
        status: [{ required: true, message: '此项必填', trigger: 'blur' }],
        address: [{ required: true, message: '此项必填', trigger: 'blur' }],
        domain: [{ required: true, message: '此项必填', trigger: 'blur' }],
        // accountName: [{ required: true, message: '此项必填', trigger: 'blur' }],
        // telephone: [{ required: true, message: '此项必填', trigger: 'blur' }],
        introduction: [
          { required: true, message: '此项必填', trigger: 'blur' },
        ],
        merchant2: [{ required: true, message: '此项必填', trigger: 'blur' }],
        checkM2Repeat: [
          { required: true, message: '此项必填', trigger: 'blur' },
        ],
        merchantCode: [
          { required: true, message: '此项必填', trigger: 'blur' },
        ],
        outsideSwitch: [
          { required: true, message: '此项必填', trigger: 'blur' },
        ],
        commission: [{ required: true, message: '此项必填', trigger: 'blur' }],
        message: [{ required: true, message: '此项必填', trigger: 'blur' }],
        systemId: [{ required: true, message: '此项必填', trigger: 'blur' }],
        appId: [{ required: true, message: '此项必填', trigger: 'blur' }],
        appSecret: [{ required: true, message: '此项必填', trigger: 'blur' }],
        projectApprovalId: [
          { required: true, message: '此项必填', trigger: 'blur' },
        ],
        reportTemplateId: [
          { required: true, message: '此项必填', trigger: 'blur' },
        ],
        reviewRejectionId: [
          { required: true, message: '此项必填', trigger: 'blur' },
        ],
        statusChangeId: [
          { required: true, message: '此项必填', trigger: 'blur' },
        ],
        weChatPush: [{ required: true, message: '此项必填', trigger: 'blur' }],
        depc: [
          {
            required: true,
            type: 'array',
            message: '此项必填',
            trigger: 'blur',
          },
        ],
      },
      defaultList: [],
      uploadList: [
        {
          label: '渠道PC登录页logo',
          remark: '(建议上传101*69PNG图片)',
          photoList: [],
          fieldName: 'developersLoginLogo',
        },
        {
          label: '渠道PC首页logo',
          remark: '(建议上传200*50PNG图片)',
          photoList: [],
          fieldName: 'developersIndexLogo',
        },
        {
          label: '案场助手登录页logo',
          remark: '(建议上传375*270PNG图片)',
          photoList: [],
          fieldName: 'assistantLoginLogo',
        },
        {
          label: '案场助手首页logo',
          remark: '(建议上传100*66PNG图片)',
          photoList: [],
          fieldName: 'assistantIndexLogo',
        },
        {
          label: '案场助手退出页logo',
          remark: '(建议上传75*75PNG图片)',
          photoList: [],
          fieldName: 'assistantExitLogo',
        },
        {
          label: '分销PC登录页logo',
          remark: '(建议上传101*69PNG图片)',
          photoList: [],
          fieldName: 'agencyLoginLogo',
        },
        {
          label: '分销PC首页logo',
          remark: '(建议上传200*50PNG图片)',
          photoList: [],
          fieldName: 'agencyIndexLogo',
        },
        {
          label: '分销商h5登录页logo',
          remark: '(建议上传166*55PNG图片)',
          photoList: [],
          fieldName: 'h5LoginLogo',
        },
        {
          label: '自有公众号配置',
          remark: '(建议上传166*160PNG图片)',
          photoList: [],
          fieldName: 'agencyServiceLogo',
        },
        {
          label: '自有程序配置',
          remark: '(建议上传166*160PNG图片)',
          photoList: [],
          fieldName: 'agencyWeappLogo',
        },
      ],
      cellIndex: 0,
      fileName: '',
      showMerchantCode: '0',
    };
  },
  methods: {
    M2Change(e) {
      this.showMerchantCode = e;
    },
    addWx() {
      if (this.formItem.wxConfigs.length <= 3) {
        // if (this.formItem.wxConfigs[0].systemId === '0') {
        //   this.$Message.error('已存在所属系统案场和分销的微信配置，无需再添加')
        //   return;
        // }
        const systemId = '2';
        this.formItem.wxConfigs.push({
          systemId,
          appName: '',
          appId: '',
          appSecret: '',
          projectApprovalId: '',
          reportTemplateId: '',
          reviewRejectionId: '',
          statusChangeId: '',
          weChatPush: '',
        });
      } else {
        this.$Message.error('最多添加四个微信配置');
      }
    },

    deleteWx(index) {
      this.formItem.wxConfigs.splice(index, 1);
    },
    selectCell(i, fileName) {
      this.cellIndex = i;
      this.fileName = fileName;
    },
    selectPc(value, selectedData) {
      this.formItem.province = value[0];
      this.formItem.city = value[1];
      this.formItem.zone = value[2];
    },
    backDefault(i, fileName) {
      this.formItem[fileName] = '';
      this.uploadList[i].photoList.splice(0, 1);
    },
    handleView() {},
    handleSuccess(res, file) {
      const i = this.cellIndex;
      if (this.uploadList[i].photoList.length === 0) {
        this.uploadList[i].photoList.push(res.data);
      } else {
        this.uploadList[i].photoList.splice(0, 1);
        this.uploadList[i].photoList.push(res.data);
      }
      this.formItem[this.fileName] = res.data;
    },
    handleFormatError(file) {
      this.$Notice.warning({
        duration: 8,
        title: '文件格式不对',
        desc: file.name + '格式不正确, 请选择jpg或者png.',
      });
    },
    handleMaxSize(file) {
      this.$Notice.warning({
        duration: 8,
        title: '文件超大',
        desc: file.name + '超过1M',
      });
    },
    async getProvince() {
      const { responseCode, data } = await this.$request(
        commonApi.listProvince
      );
      if (responseCode === '1') {
        data.forEach((item, index) => {
          item.loading = false;
          item.children = [];
        });
        this.pcList = data;
      }
    },
    loadData(item, callback) {
      const len = item.__label.split('/').length;
      item.loading = true;
      setTimeout(async () => {
        const { responseCode, data } = await this.$request(commonApi.listCity, {
          provinceId: item.value,
        });
        if (responseCode === '1') {
          if (len < 2) {
            data.forEach((city, index) => {
              city.loading = false;
              city.children = [];
            });
          }
          item.children = data;
        }
        item.loading = false;
        callback();
      }, 500);
    },
    async aa() {
      let arr = [];
      this.$refs['formItem'].validate((valid) => {
        arr.push(valid);
      });
      this.formItem.wxConfigs.forEach((item, index) => {
        const form = 'formItem' + index;
        this.$refs[form][0].validate((valid1) => {
          arr.push(valid1);
        });
      });
      return arr;
    },
    async onSubmit(name) {
      let a = await this.aa();
      console.log(a, 99);
      if (!a.includes(false)) {
        const value = this.formItem;
        console.log(11111);
        delete value.depc;
        const params = {
          ...value,
        };
        // 判断是否是闪卖，添加默认值
        var agencyWeappConfig = false;
        var agencyServiceConfig = false;
        for (var i = 0; i < params.wxConfigs.length; i++) {
          let systemId = params.wxConfigs[i].systemId;
          if (systemId == 7) {
            agencyWeappConfig = true;
            let agencyWeappFrom = params.wxConfigs[i].agencyWeappFrom;
            if (agencyWeappFrom == 0) {
              params.wxConfigs[i].appId = 'wxeb5f69727b1c40fc';
              params.wxConfigs[i].appSecret =
                'c37642cf835440cf3978b89b4b2d32e7';
              params.wxConfigs[i].appName = '闪卖';
              params.wxConfigs[i].weChatPush = '0';
              params.wxConfigs[i].projectApprovalId = '';
              params.wxConfigs[i].reportTemplateId = '';
              params.wxConfigs[i].reviewRejectionId = '';
              params.wxConfigs[i].statusChangeId = '';
              params.agencyServiceLogo =
                'http://img.devch.qiaofangcloud.cn/upload/default/20201022/1603348861273.png';
            }
          } else if (systemId == 8) {
            agencyServiceConfig = true;
            let agencyServiceFrom = params.wxConfigs[i].agencyServiceFrom;
            if (agencyServiceFrom == 0) {
              params.wxConfigs[i].appId = 'wxd3bf8709f7c40faf';
              params.wxConfigs[i].appSecret =
                '7094b0d0a754d027263d189db7ec00e0';
              params.wxConfigs[i].appName = '闪卖';
              params.wxConfigs[i].weChatPush = '1';
              params.wxConfigs[i].projectApprovalId =
                'olzqXw0mJ1_IlYDTwgq7axn1xOkxnN6lsBKtXWj5DE4';
              params.wxConfigs[i].reportTemplateId =
                'aendd4YPFJ0RETXHqYjeY0Aib29PWso67GMOgvSIiu0';
              params.wxConfigs[i].reviewRejectionId =
                'oGpd4kJ3PKa67iTs2T2amF6QL4LPiF944B4tCE7Za1c';
              params.wxConfigs[i].statusChangeId =
                'f_K2L9PuklcRCx4TqngU-X4SwnspNUZqV3pummZKCDo';
              params.agencyWeappLogo =
                'http://img.devch.qiaofangcloud.cn/upload/default/20201022/1603348861273.png';
            }
          } else {
            params.wxConfigs[i].appName = '';
          }
        }
        params.weappMessage = agencyWeappConfig && agencyServiceConfig;
        if (this.$route.query.id) {
          const { responseCode, responseMessage, data } = await this.$request(
            companyApi.updateCompany,
            params
          );
          if (responseCode === '1') {
            this.$Message.success('修改成功！');
            this.$router.push({ path: '../channelProvider' });
          } else {
            this.$Message.error(responseMessage);
          }
        } else {
          const { responseCode, responseMessage, data } = await this.$request(
            companyApi.addCompany,
            params
          );
          if (responseCode === '1') {
            this.$Message.success('新增成功！');
            this.$router.push({ path: '../channelProvider' });
          } else {
            this.$Message.error(responseMessage);
          }
        }
      }
    },
    async getDetail(id) {
      const { responseCode, data } = await this.$request(
        companyApi.getCompany,
        { id }
      );
      if (responseCode === '1') {
        this.uploadList.forEach((item) => {
          if (data[item.fieldName]) {
            item.photoList.push(data[item.fieldName]);
          }
        });
        data.depc = [data.province, data.city, data.zone];
        data.accountName = data.partnerInfo && data.partnerInfo.accountName;
        data.telephone = data.partnerInfo && data.partnerInfo.telephone;
        data.partnerInfoId = data.partnerInfo && data.partnerInfo.id;
        for (var i = 0; i < data.wxConfigs.length; i++) {
          let systemId = data.wxConfigs[i].systemId;
          let appId = data.wxConfigs[i].appId;
          if (systemId == 7 && appId == 'wxeb5f69727b1c40fc') {
            data.wxConfigs[i].agencyWeappFrom = 0;
          } else {
            data.wxConfigs[i].agencyWeappFrom = 1;
          }
          if (systemId == 8 && appId == 'wxd3bf8709f7c40faf') {
            data.wxConfigs[i].agencyServiceFrom = 0;
          } else {
            data.wxConfigs[i].agencyServiceFrom = 1;
          }
        }
        delete data.partnerInfo;
        this.formItem = data;
      }
    },
  },
  mounted() {
    this.getProvince();
    const id = this.$route.query.id;
    if (id) {
      this.getDetail(id);
    }
  },
  components: {},
};
</script>
<style lang="scss" scoped>
.new-channel {
  .form {
    background: #fff;
    margin-top: 15px;
    padding: 25px 15px 0;
    border-radius: 5px;

    .ivu-form {
      display: flex;
    }

    .base-form {
      width: 50%;
      border-right: 1px solid #eee;

      .upload-js {
        color: #fff;
        background-color: #2d8cf0;
        border-color: #2d8cf0;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
      }
    }

    .base-table {
      width: 50%;
      padding-left: 50px;

      .function-table,
      .logo-table {
        width: 100%;
        border-collapse: collapse;
        margin-bottom: 30px;

        thead {
          background: #f1f1f1;
        }

        tr {
          height: 40px;
        }

        td {
          padding: 10px;
          border: 1px solid #d0d0d0;
        }
      }

      .logo-table {
        .label {
          font-size: 15px;
          color: #333;
        }
        .remark {
          color: #999;
        }
        .image {
          width: 100px;
          height: 80px;
        }
        .hf {
          position: relative;
          top: -5px;
        }
      }
    }

    p {
      font-size: 22px;
      font-weight: 600;
      padding-bottom: 10px;
    }

    .on-submit {
      padding: 15px;
      display: flex;
      justify-content: flex-end;
    }
  }
}
</style>
